/*
 * uniapp样式
 */
@import 'components/xyui/src/xyicon.css';
* {
	outline: 0;
    outline-color: initial;
    outline-style: initial;
    outline-width: 0px;
}
body {
	-webkit-font-smoothing: antialiased;
	font-family: PingFang SC,STHeitiSC-Light,Helvetica-Light,arial,sans-serif,Droid Sans Fallback;
}
page {
	background-color: #efeff4;
	height: 100%;
	font-size: 14px;
	.container {
		padding-bottom: calc(44px + var(--window-bottom));
	}
	uni-button,
	button {
		font-size: $font-lg + 2upx;
		font-weight: normal;
		&.no-border:before,
		&.no-border:after {
			border: 0;
		}
	}
	uni-button[type=default],
	button[type=default] {
		color: $font-color-dark;
	}
	uni-button[type=primary],
	button[type=primary],
	.uni-radio-input-checked {
		border-color: $uni-color-primary !important;
		background-color: $uni-color-primary!important;;
	}

	/* #ifdef H5 */
	@media (min-width: 700px) {
		html,
		.uni-tabbar,
		.uni-page-head {
			min-width: 400px;
			width: 30% !important;
			margin: 0 auto;
			right: 0;
			font-size: 14px !important;
			background: #555;
			overflow: hidden;
		}
	}
	/* #endif */
}

/* uni-ui样式美化 */
/deep/ {
	.uni-navbar {
		z-index: 2;
		.uni-navbar--border {
			 border-bottom-width: 0px;
		}
		.uni-navbar__header {
			.uni-navbar__header-btns-left {
				width: auto !important;
				.back {
					font-size: 22px;
		    		font-weight: 500;
				}
			}
			.uni-navbar__header-container {
				width: 100% !important;
			}
			.uni-navbar__header-btns.uni-navbar__content_view {
				width: auto !important;
			}
			.uni-searchbar {
				width: 100% !important;
				.uni-searchbar__box {
					border: none;
					height: 32px;
				}
			}
			/* #ifdef MP */
			.uni-navbar__header-btns:nth-child(2) {
				width: 230rpx !important;
			}
			/* #endif */
		}
	}
	.uni-number-box-round {
		transform: scale(0.5);
		box-sizing: content-box;
		border: 1px solid #c8c7cc !important;
		padding: 4px !important;
		width: auto !important;
		border-radius: 20px !important;
		margin-right: -30px !important;
		.uni-numbox__plus,
		.uni-numbox__minus {
			border-radius: 20px !important;
			background-color: #F5F6F7;
		}
		.uni-numbox--text {
			font-size: 30px !important;
		}
		.uni-numbox__value {
			border: 0 !important;
			padding-top: 5px;
			font-size: 25px !important;
		}
	}
}

/*
 * 通用组件
 */
.xy-mask {
    z-index: 999;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: $uni-bg-color-mask;
	opacity: 1;
}
.xy-input {
	height: 26px;
	line-height: 1.1;
	padding: 6px;
	color: #353535;
	font-size: 15px;
	appearance: none;
	border: 1px solid #e5e5e5;
	box-shadow: none;
	border-radius: 4px;
	outline: 0;
	display: block;
	margin: 0;
	background: #fff;
	resize: none;
}
.alias-search-bar {
	width: 100%;
	padding: 0px 12px;
	background-color: rgba(231, 231, 231, 0.7);
	border-radius: 20px;
	line-height: 32px;
	height: 32px;
	color: #808080;
	font-size: 13px;
}
.safe-bottom {
    padding-bottom: 0;
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

/*
 * 通用样式
 */
.iframe {
    width: 100%;
    height: 100%;
    border: 0;
}
.flex {
    display: flex;
}
.flex-row-center {
	justify-content: center;
}
.flex-col-center {
	align-items: center;
}
.flex-all-center {
	justify-content: center;
	align-items: center;
}
.inline-block {
	display: inline-block;
}
.hidden {
	display: none !important;
}
.clamp {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: block;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.inline-block {
	display: inline-block;
}
.all-gray {
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -ms-filter: grayscale(1);
    -o-filter: grayscale(1);
    filter: grayscale(1);
}

/* 颜色 */
.text-primary {
	color: $uni-color-primary;
}
.text-info {
	color: $uni-color-info;
}
.text-success {
	color: $uni-color-success;
}
.text-warning {
	color: $uni-color-warning;
}
.text-error {
	color: $uni-color-error;
}
.text-default {
	color: $uni-text-color;
}
.text-inverse {
	color: $uni-text-color-inverse;
}
.text-gray {
	color: $uni-text-color-grey;
}
.text-placeholder {
	color: $uni-text-color-placeholder;
}
.text-disable {
	color: $uni-text-color-disable;
}
.bg-white {
    background: #fff;
}

/* 字大小 */
.font-xs {
	font-size: 10px;
	transform: scale(0.8);
}
.font-sm {
	font-size: 12px;
}
.font-default {
	font-size: 14px;
}
.font-md {
	font-size: 16px;
}
.font-lg {
	font-size: 18px;
}
.font-xl {
	font-size: 22px;
}

/*
 * 边框边距
 */
.b-b:after,
.b-t:after {
	position: absolute;
	z-index: 3;
	left: 0;
	right: 0;
	height: 0;
	content: '';
	transform: scaleY(.5);
	border-bottom: 1px solid $border-color-base;
}
.b-b:after {
	bottom: 0;
}
.b-t:after {
	top: 0;
}

// border utilities
.b-0 {
    border: 0 !important;
}
.b-r-0 {
    border-radius: 0 !important;
}

// position utilities
// -------------------------
.pos-r { position: relative !important; }
.pos-a { position: absolute !important; }
.pos-f { position: fixed !important; }

// constrain utilities
// -------------------------
.w-sm   { width: 25% !important; }
.w-md   { width: 50% !important; }
.w-lg   { width: 75% !important; }
.w-full { width: 100% !important; }


// spacer utilities
// -------------------------

$spacer:   20px;
$spacer-x: $spacer;
$spacer-y: $spacer;

// margin

.m-a-0 { margin:        0 !important; }
.m-t-0 { margin-top:    0 !important; }
.m-r-0 { margin-right:  0 !important; }
.m-b-0 { margin-bottom: 0 !important; }
.m-l-0 { margin-left:   0 !important; }
.m-x-0 { margin-right:  0 !important; margin-left:   0 !important; }
.m-y-0 { margin-top:    0 !important; margin-bottom: 0 !important; }

.m-a { margin:        $spacer !important; }
.m-t { margin-top:    $spacer-y !important; }
.m-r { margin-right:  $spacer-x !important; }
.m-b { margin-bottom: $spacer-y !important; }
.m-l { margin-left:   $spacer-x !important; }
.m-x { margin-right:  $spacer-x !important; margin-left: $spacer-x !important; }
.m-y { margin-top:    $spacer-y !important; margin-bottom: $spacer-y !important; }
.m-x-auto { margin-right: auto !important; margin-left: auto !important; }

.m-a-xs { margin:        ($spacer/4) !important; }
.m-t-xs { margin-top:    ($spacer-y/4) !important; }
.m-r-xs { margin-right:  ($spacer-x/4) !important; }
.m-b-xs { margin-bottom: ($spacer-y/4) !important; }
.m-l-xs { margin-left:   ($spacer-x/4) !important; }
.m-x-xs { margin-right:  ($spacer-x/4) !important; margin-left: ($spacer-x/4) !important; }
.m-y-xs { margin-top:    ($spacer-y/4) !important; margin-bottom: ($spacer-y/4) !important; }

.m-a-sm { margin:        ($spacer/2) !important; }
.m-t-sm { margin-top:    ($spacer-y/2) !important; }
.m-r-sm { margin-right:  ($spacer-x/2) !important; }
.m-b-sm { margin-bottom: ($spacer-y/2) !important; }
.m-l-sm { margin-left:   ($spacer-x/2) !important; }
.m-x-sm { margin-right:  ($spacer-x/2) !important; margin-left: ($spacer-x/2) !important; }
.m-y-sm { margin-top:    ($spacer-y/2) !important; margin-bottom: ($spacer-y/2) !important; }

.m-a-md { margin:        ($spacer * 1.5) !important; }
.m-t-md { margin-top:    ($spacer-y * 1.5) !important; }
.m-r-md { margin-right:  ($spacer-y * 1.5) !important; }
.m-b-md { margin-bottom: ($spacer-y * 1.5) !important; }
.m-l-md { margin-left:   ($spacer-y * 1.5) !important; }
.m-x-md { margin-right:  ($spacer-x * 1.5) !important; margin-left:   ($spacer-x * 1.5) !important; }
.m-y-md { margin-top:    ($spacer-y * 1.5) !important; margin-bottom: ($spacer-y * 1.5) !important; }

.m-a-lg { margin:        ($spacer * 3) !important; }
.m-t-lg { margin-top:    ($spacer-y * 3) !important; }
.m-r-lg { margin-right:  ($spacer-y * 3) !important; }
.m-b-lg { margin-bottom: ($spacer-y * 3) !important; }
.m-l-lg { margin-left:   ($spacer-y * 3) !important; }
.m-x-lg { margin-right:  ($spacer-x * 3) !important; margin-left:   ($spacer-x * 3) !important; }
.m-y-lg { margin-top:    ($spacer-y * 3) !important; margin-bottom: ($spacer-y * 3) !important; }

// padding

.p-a-0 { padding:        0 !important; }
.p-t-0 { padding-top:    0 !important; }
.p-r-0 { padding-right:  0 !important; }
.p-b-0 { padding-bottom: 0 !important; }
.p-l-0 { padding-left:   0 !important; }
.p-x-0 { padding-left:   0 !important; padding-right: 0 !important; }
.p-y-0 { padding-top:    0 !important; padding-bottom: 0 !important; }

.p-a { padding:        $spacer !important; }
.p-t { padding-top:    $spacer-y !important; }
.p-r { padding-right:  $spacer-x !important; }
.p-b { padding-bottom: $spacer-y !important; }
.p-l { padding-left:   $spacer-x !important; }
.p-x { padding-right:  $spacer-x !important; padding-left:   $spacer-x !important; }
.p-y { padding-top:    $spacer-y !important; padding-bottom: $spacer-y !important; }

.p-a-xs { padding:        ($spacer / 4) !important; }
.p-t-xs { padding-top:    ($spacer-y / 4) !important; }
.p-r-xs { padding-right:  ($spacer-y / 4) !important; }
.p-b-xs { padding-bottom: ($spacer-y / 4) !important; }
.p-l-xs { padding-left:   ($spacer-y / 4) !important; }
.p-x-xs { padding-right:  ($spacer-x / 4) !important; padding-left:   ($spacer-x / 4) !important; }
.p-y-xs { padding-top:    ($spacer-y / 4) !important; padding-bottom: ($spacer-y / 4) !important; }

.p-a-sm { padding:        ($spacer / 2) !important; }
.p-t-sm { padding-top:    ($spacer-y / 2) !important; }
.p-r-sm { padding-right:  ($spacer-y / 2) !important; }
.p-b-sm { padding-bottom: ($spacer-y / 2) !important; }
.p-l-sm { padding-left:   ($spacer-y / 2) !important; }
.p-x-sm { padding-right:  ($spacer-x / 2) !important; padding-left:   ($spacer-x / 2) !important; }
.p-y-sm { padding-top:    ($spacer-y / 2) !important; padding-bottom: ($spacer-y / 2) !important; }

.p-a-md { padding:        ($spacer * 1.5) !important; }
.p-t-md { padding-top:    ($spacer-y * 1.5) !important; }
.p-r-md { padding-right:  ($spacer-y * 1.5) !important; }
.p-b-md { padding-bottom: ($spacer-y * 1.5) !important; }
.p-l-md { padding-left:   ($spacer-y * 1.5) !important; }
.p-x-md { padding-right:  ($spacer-x * 1.5) !important; padding-left:   ($spacer-x * 1.5) !important; }
.p-y-md { padding-top:    ($spacer-y * 1.5) !important; padding-bottom: ($spacer-y * 1.5) !important; }

.p-a-lg { padding:        ($spacer * 3) !important; }
.p-t-lg { padding-top:    ($spacer-y * 3) !important; }
.p-r-lg { padding-right:  ($spacer-y * 3) !important; }
.p-b-lg { padding-bottom: ($spacer-y * 3) !important; }
.p-l-lg { padding-left:   ($spacer-y * 3) !important; }
.p-x-lg { padding-right:  ($spacer-x * 3) !important; padding-left:   ($spacer-x * 3) !important; }
.p-y-lg { padding-top:    ($spacer-y * 3) !important; padding-bottom: ($spacer-y * 3) !important; }
